

<?php
	if(isset($_REQUEST['congtrinh']))
	{
		echo "<script>CongTrinh = ".$_REQUEST['congtrinh']."</script>";	
	}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="styles/kendo.silver.min.css" rel="stylesheet">
<link href="styles/kendo.common.min.css" rel="stylesheet">
<link href="myStyles/app.css" rel="stylesheet">
<link href="..examples/content/shared/styles/examples-offline.css" rel="stylesheet">


<script src="js/jquery.min.js"></script>
<script src="js/kendo.splitter.min.js"></script>
<script src="js/kendo.all.min.js"></script>
<script src="js/kendo.dropdownlist.min.js"></script>
<script src="myScripts/app.js"></script>
<script src="myScripts/test.js"></script>
<title>Index - HTML</title>

			<script type="text/x-kendo-template" id="toolbartemplate">
                <div class="toolbar">
                    <label class="category-label" for="category">Show products by category:</label>
                    <input type="search" id="category" style="width: 230px"></input>
                </div>
            </script>
            <script type="text/x-kendo-template" id="template">	
				<div id="controlbar"></div>			
                              
				<div>		
					<div class="danhsachcongviec"></div>
				</div>
			</script>



</head>

<body>
<div class="banner">CHƯƠNG TRÌNH DỰ TOÁN - SGU </div>

<div id="example" class="k-content">
<div class="mainbar">
  <div id="leftmenu">
    <input class="k-button" name="click" type="button" value="Click" onClick="themhm()"/>
    <input class="k-button" name="clickagian" type="button" value="Click again" onClick="_test2()"/>
    <input class="k-button" id = "setCongTrinh" name="andclickagian" type="button" value="And Click again"/>
    <input class="k-button" name="dont" type="button" value="Don't Click" onclick='xoaCT($("#danhsachcongtrinh").val())'/>
    <input type="hidden" id = "res" />
    <div id = "hide"></div>
  </div>
  <div id="mainmenu">
    <input id="danhsachcongtrinh" value="1" />
  </div>
</div>
<div id="vertical">
  <div id="top-pane">
    <div id="horizontal" style="height: 100%; width: 100%;">
      <div id="left-pane">
        <div class="pane-content"> 
          <!-- begin Navigation --> 
          <div id="example" class="k-content">
          	<span id="control" style="display" class="k-button">Xem bảng công việc</span>  
            <div id="window"> 
            
            <table width="700" border="0">
              <tr>
                <td>Bước 1: Chọn một hạng mục:</td>
                <td><input id="chonhangmuc" value="1" /></td>
              </tr>
                <td colspan="2">Bước 2: Chọn một công việc từ bảng bên dưới<br />Chú ý: Click vào ô MHDM để chọn</td>
               
              </tr>
              <tr>
              <tr>
                <td>Bước 3: Nhập vào khối lượng:</td>
                <td>
                
                <input class="k-textbox" type = "text" value = "0" id="khoiluong" type="number" />
                </td>
              </tr>
              <tr>
                <td>&nbsp;</td>
                <td>
                <input class="k-button" id = "themCongViec" name="andclickagian" type="button" value="Click vào đây để thêm Công việc dược chọn"/>
                </td>
              </tr>
            </table>           	  
                           	
            	<div id="dinhmuc">
                	<div id="details"></div>
                </div>                    
            </div>
            <script>
                $(document).ready(function() {	
					var wnd, selection,
                    detailsTemplate;
                	
					
					$("#themCongViec").click( function() {						
						var kl = document.getElementById("khoiluong").value;
						//alert(kl+"++");
						if(selection != null)
						{
							var hangmuc = $("#chonhangmuc").val();
							
							var CongViecMoi = new modelCongViec	({
								CVid: null,
								MaCV: selection.get("MHDM"),
								TenCV: selection.get("TenCV"),
								DVT: selection.get("DVT"),
								KhoiLuong: kl,
								HMid: hangmuc,

								
							});
							//alert(kl+"++");
							alert("Started");
							//alert(selection.get("TenCV") + CongTrinh);
							dataCongViec.add(CongViecMoi);alert("Added");							
							//dataCongViec.add(
							dataCongViec.sync();alert("Synch");
							dataCongViec.read();alert("read");
							alert(CongViecMoi.get("TenCV") + "|" + CongViecMoi.get("HMid") + "|" + CongViecMoi.get("KhoiLuong"));
							
						}
						else
							alert("Vui lòng chọn một công việc trong bảng!");	
					});
		
					$("#chonhangmuc").kendoDropDownList({
                        dataTextField: "TenHM",
                        dataValueField: "HMid",
                        dataSource: dataHangMuc,
                        index: 0,
                        //change: chuyenCongTrinh,
                    });
					
					var dropdownlist = $("#chonhangmuc").data("kendoDropDownList"),
                        setValue = function(e) {
                            if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode)
                                dropdownlist.value(CongTrinh);
                        },
                        setIndex = function(e) {
                            if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode) {
                                var index = parseInt($("#index").val());
                                dropdownlist.select(index);
                            }
                        },
                        setSearch = function(e) {
                            if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode)
                                dropdownlist.search($("#word").val());
                        };

					dropdownlist.value(CongTrinh);
					
					
					var gridDinhMuc = $("#dinhmuc").kendoGrid({
						dataSource: dataDinhMuc,
						selectable: "cell",
						//rowTemplate: kendo.template($("#rowTemplateDinhMuc").html()),
						//
						columns: [
						{
							field: "cid",
							title: "cid",	
							width: 90,
						},
						{
							field: "MHDM",
							title: "MHDM",	
							width: 90,
						},
						{
							field: "TenCV",
							title: "Ten Cong Viec",	
						},
						{
							field: "DVT",
							title: "DVT",
							width: 90,	
						},
						{ command: { text: "View Details", click: xemchitiet }, title: "Xem", width: "130px" }   
						],
						//
						filterable: true,
						change: onChange,
						
						
                        
					}).data("kendoGrid");
					
					function onChange(arg) {
						var HMid = this.select().data("cid");
						var selected = $.map(this.select(), function(item) {
							return $(item).text();
						});
						selection = dataDinhMuc.get(selected);
						var value = $("#chonhangmuc").val();
						
						//alert(selection.get("DVT") + "  " + value);
						//alert("Selected: " + selected.length + " item(s), [" + selected.join(", ") + "]");
                	}
					
					wnd = $("#details")
                        .kendoWindow({
                            title: "Chi Tiet",
                            modal: false,
                            visible: false,
                            resizable: false,
                            width: 500,
							
                        }).data("kendoWindow");

                    detailsTemplate = kendo.template($("#template_dinhmuc").html());
                
					
                    var window = $("#window"),
                        control = $("#control")
                                .bind("click", function() {
									//alert("");
                                    window.data("kendoWindow").open();
                                    control.hide();
                                });
					
					
					

                    var onClose = function() {
                        control.show();
                    }

                    if (!window.data("kendoWindow")) {
                        window.kendoWindow({
                            width: "800px",
							height: "700px",
                            title: "Công tác dịnh mức",
                            close: onClose
                        });
                    }
					window.data("kendoWindow").close();
					//
                			
                });
            </script>
            
            
			<script type="text/x-kendo-template" id="template_dinhmuc">
                <div id="details-container">
                    <h2>#= MHDM #</h2>
                    <em>#= TenCV #</em>
                    <dl>
                        <dt>#= DVT #</dt>
                        <dt></dt>
                    </dl>
                </div>
            </script>
            <script>//This is for the window
			
            </script>            
        </div>
          <!-- end   Navigation --> 
        </div>
      </div>
      <div id="center-pane">
        <div class="pane-content"> 
          <!-- Main Content -->
          <div id="demo"></div>
        </div>
      </div>
    </div>
  </div>
</div>

<script type="text/javascript">
	var modelDinhMuc = kendo.data.Model.define({
		id: "MHDM",
		fields: {
			cid: {
				type: "number",
			},
			MHDM: {
				type: "string",	
			},
			TenCV: {
				type: "string",	
			},
			DVT: {
				type: "string",	
			},	
		},
		
	});
	
	var modelCongTrinh = kendo.data.Model.define({
		id: "CTid",
		fields:{
			"CTid": {
				type: "number",	
				editable: false,
			},
			"TenCT": {
				type: "string",
				validation: { required: true},
			},	
			"Khac": {
				type: "string",	
			}
			
		},
			
	});
	
	var modelHangMuc = new kendo.data.Model.define({
		id: "HMid",
		fields: {
			
			"HMid": { 
				type: "number",
				editable: false,		
			},
			TenHM: {
				type: "string",	
				validation: {	
					required: true,
				}
			},		
			MaCT:	{
				type: "number",	
				editable: false,
				defaultValue: CongTrinh,
			},
			Khac: {
				type: "string",	
			}
			
		},
		
	});

</script>


<script type="text/javascript">

	var dataDinhMuc = new kendo.data.DataSource({
		transport: {
			read: "dutoan/dinhmuc/fetch.php",	
		},
		
		schema: {
			data: "data",
			model: modelDinhMuc,	
		}
		
	
	});
	
	var dataCongTrinh = new kendo.data.DataSource({					
		transport: {
			read: "data/congtrinh.php",
			
			update:{
				url: "data/congtrinh.php",
				type: "POST",
					
			},
				
		},	
		error: function(e) {
			alert(e.responseText);
		},				
		schema: {
			data: "data",
			model: modelCongTrinh,
			
		},
	}); 
	
	var dataHangMuc = new kendo.data.DataSource({		
		transport: {
			read: "dutoan/hangmuc/fetch.php?congtrinh=" + CongTrinh,
			update:{
				url: "dutoan/hangmuc/update.php",
				type: "POST",
					
			},
			create: {
				url: "dutoan/hangmuc/create.php",
				type: "POST",	 
			},
			destroy: {
				url: "dutoan/hangmuc/destroy.php",
				type: "POST",
			},
		},
		
		schema: {
			data: "data",
			model: modelHangMuc,
		},
		editalbe: true,

		//serverFiltering: true,
		//filter: { field: "MaCT", operator: "eq", value:$("#danhsachcongtrinh").val() },
   
	
	});
	
</script>
<script>                
$(document).ready(function() {
	$("#vertical").kendoSplitter({
		orientation: "vertical",
		panes: [
			{ collapsible: false , size: "900px"},
			//{ collapsible: false, size: "100px" },
			//{ collapsible: false, resizable: false, size: "100px" }
		]
	});

	$("#horizontal").kendoSplitter({
		panes: [
			{ resizable: false, collapsible: false, size: "300px" },
			{ collapsible: false },
		   
		]
	});
	
	$("#danhsachcongtrinh").kendoDropDownList({
		dataTextField: "TenCT",
		dataValueField: "CTid",
		dataSource: dataCongTrinh,
		index: 0,
		change: chuyenCongTrinh,
	});
	var dropdownlist = $("#danhsachcongtrinh").data("kendoDropDownList"),
		setValue = function(e) {
			if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode)
				dropdownlist.value(CongTrinh);
		},
		setIndex = function(e) {
			if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode) {
				var index = parseInt($("#index").val());
				dropdownlist.select(index);
			}
		},
		setSearch = function(e) {
			if (e.type != "keypress" || kendo.keys.ENTER == e.keyCode)
				dropdownlist.search($("#word").val());
		};

				
	var gridHangMuc = $("#demo").kendoGrid({
		 dataSource: dataHangMuc,
		 columns: [
			{ 
				field: "HMid",
				title: "Mã Hạng Mục",
				width: 120,
			},
			{ 
				field: "TenHM",
				title: "Tên Hạng Mục",
				
			}, 
			{
				field: "MaCT",
				title: "CT",
				width: 1,
			},
			{
				field: "Khac",
				title: "Ghi Chú",
			},
			
			{ command: [ {text: "Sửa", name: "edit"}, {text:"Xóa",name:"destroy"}], title: "Sửa / Xóa ", width: "160px" },
		],
		detailTemplate: kendo.template($("#template").html()),
		detailInit: themCongViec,
		editable: "inline",
		navigable: true,  // enables keyboard navigation in the grid
		toolbar: [ "create", "update", "cancel", ]  // adds save and cancel buttons
		//toolbar: kendo.template($("#toolbartemplate").html()),
	});
});	
</script>
            
</body>
</html>


